fix(rhwp-chrome): 썸네일 로딩 스피너 정리 + options CSP 호환#168
fix(rhwp-chrome): 썸네일 로딩 스피너 정리 + options CSP 호환#168edwardkim merged 5 commits intoedwardkim:develfrom
Conversation
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot 리뷰 (PR edwardkim#167) 반영 — 다른 non-module 스크립트 (content-script.js, dev-tools-inject.js)와 동일하게 IIFE + 'use strict' 패턴으로 감싸 전역 스코프 오염 방지.
There was a problem hiding this comment.
Pull request overview
Fixes two user-visible issues in the rhwp-chrome extension: leftover thumbnail loading spinner after image insertion, and the options page failing under Chrome extension CSP due to inline scripts.
Changes:
- Clear the thumbnail container placeholder text before appending the loaded thumbnail image.
- Move options page inline script into a standalone
options.js(IIFE + strict mode) and reference it fromoptions.html. - Update
build.mjsto copyoptions.jsintodist/.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| rhwp-chrome/content-script.js | Clears thumbnail placeholder content so the loading spinner doesn’t remain after image insertion. |
| rhwp-chrome/options.html | Removes inline script and loads options.js to comply with extension CSP. |
| rhwp-chrome/options.js | New external options logic (i18n + load/save settings) compatible with CSP. |
| rhwp-chrome/build.mjs | Copies options.js into dist/ so the options page can load it in the built extension. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
| data-hwp-title="전입신고서" | ||
| data-hwp-pages="2" | ||
| data-hwp-thumbnail="/thumbs/preview.webp" | ||
| data-hwp-thumbnail="https://example.com/thumbs/preview.webp" |
There was a problem hiding this comment.
rhwpDev.help() 출력 예시에서 사용자에게 보여주는 코드:
data-hwp-thumbnail="/thumbs/preview.webp" ← 상대경로
그러나 실제로 이 속성값을 표시하는 로직(content-script.js:60)은:
function isSafeImageUrl(url) {
try {
const parsed = new URL(url); // ← base 인자 없음
return parsed.protocol === 'https:' || parsed.protocol === 'http:';
} catch { return false; }
}
new URL("/thumbs/preview.webp") 는 base 없으면 TypeError를 던집니다 → catch에서 false → 썸네일 거절.
즉 사용자가 help 가이드를 그대로 따라 data-hwp-thumbnail="/thumbs/preview.webp"라고 적으면 썸네일이
표시되지 않습니다. 가이드와 실제 동작이 어긋나는 상태였습니다.
|
저도 이거 눈에 거슬렸습니다. ㅎㅎ |
edwardkim
left a comment
edwardkim
left a comment
There was a problem hiding this comment.
로컬 검증 완료 ✅
cargo test788개 전체 통과 (Rust 코드 무변경)- 썸네일 스피너 정리:
thumbDiv.textContent = ''추가 - options CSP: 인라인 스크립트 → options.js 분리
- build.mjs: options.js 복사 추가
깔끔한 수정입니다! 감사합니다 👍
본 v0.5.0 → v0.7.3 (라이브러리) / 0.2.0 (확장) 배포 주기에 머지된 외부 기여자 6명을 README 3개 변경 이력에 추가: - @ahnbu — Ctrl+S file handle (PR #189, 기명시) - @bapdodi — 회전 도형 리사이즈 + Flip (PR #192) - @dreamworker0 — Windows CFB 경로 (PR #152) - @marsimon — HWP 그림 효과 SVG (PR #149) - @postmelee — 썸네일 + options CSP (PR #168) - @seunghan91 — HWPX Serializer + 다수 (PR #170, #161, #163, #153, #154) 각 README 끝에 "기여자 감사" 섹션 추가 — 6명 일괄 인정. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
변경 요약
Chrome 확장에서 두 가지 사용자 체감 이슈를 수정했습니다.
rhwp-chrome/content-script.jsinsertThumbnailImg()에서 이미지 삽입 전에thumbDiv.textContent = ''로 로딩 플레이스홀더를 제거rhwp-chrome/options.html인라인 스크립트를 제거하고options.js로 분리rhwp-chrome/options.js는 다른 non-module 스크립트(content-script.js,dev-tools-inject.js)와 동일하게 IIFE +'use strict'패턴 적용rhwp-chrome/build.mjs에서options.js를dist/로 복사하도록 반영변경 파일:
rhwp-chrome/content-script.jsrhwp-chrome/options.htmlrhwp-chrome/options.js(신규)rhwp-chrome/build.mjs관련 이슈
closes #86
closes #166
테스트
본 PR 변경 범위는
rhwp-chrome/내 JS·HTML·빌드 스크립트에 한정됩니다. Rust 코어(파서/렌더러/WASM)에는 변경이 없으므로 Rust 측 항목은 무관(N/A)이지만 회귀 확인 차원에서 cargo 명령은 실제 실행했습니다.cargo test통과 — 785 passed, 0 failed (회귀 확인용 실행, 본 PR 변경과 직접 관련 없음)cargo clippy -- -D warnings통과 — 라이브러리 타겟 깨끗 통과 (회귀 확인용 실행, 본 PR 변경과 직접 관련 없음)관련 샘플 파일로 SVG 내보내기 확인— N/A: Rust 렌더러 무변경 (Chrome 확장 JS만 수정)웹(WASM) 렌더링 확인— N/A: Rust→WASM 빌드 무변경 (Chrome 확장 JS만 수정)cd rhwp-chrome && npm run build실행rhwp-chrome/dist로드 후 옵션 페이지/썸네일 동작 수동 확인스크린샷
(이상하게 배포버전에서 썸네일이 안 보입니다.)